<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>Document</title>
	</head>
	<body>
		<script>
			// 函数的不同调用方式决定了 this 的指向

			// 1. 普通函数   this 指向 window
			function fn() {
				console.log('普通函数的this' + this);
			}
			window.fn();

			// 2. 对象的方法   this 指向对象 obj
			let obj = {
				sayHi: function () {
					console.log('对象方法的this' + this);
				},
			};
			obj.sayHi();

			// 3. 构造函数   this 指向实例对象 vae; 原型对象里的 this 也指向 vae 这个实例对象
			function Star() {}
			Star.prototype.sing = function () {};
			let vae = new Star();

			// 4. 绑定事件函数   this 指向函数的调用者（ btn 这个按钮对象）
			// btn.onclick = function () {}; // 点击按钮就可以调用函数

			// 5. 定时器函数   this 指向的是 window
			setInterval(function () {
				console.log('定时器的this' + this);
			}, 1000); // 每一秒钟调用一次

			// 6. 立即执行函数   this 指向的是 window
			(function () {
				console.log('立即执行函数的this' + this);
			})();
			// 自动调用
		</script>
	</body>
</html>
